import { h, render } from "vue";
import Message from "./Message.vue";
import type { MessageType } from "../types";

const createMessage = (
  message: string,
  type: MessageType,
  timeout?: number
) => {
  const messageVnode = h(Message, {
    message,
    type,
  });
  const mountNode = document.createElement("div");
  document.body.append(mountNode);
  render(messageVnode, mountNode);

  const destroy = () => {
    render(null, mountNode);
    document.body.removeChild(mountNode);
  };

  if (timeout) {
    setTimeout(() => {
      destroy();
    }, timeout);
  }
};

export default createMessage;
